<!--
	左边菜单上面的Logo
-->
<template>
	<div class="logo-wrapper">
		<img src="~@/assets/images/logo.png" alt="">
		<span v-if="!isCollapse" class="logo-text">vue3-element-plus</span>
	</div>
</template>

<script>
export default {
	name: "Logo",
	props:[],
	data(){
		return {
			isCollapse:true,
		}
	},

}
</script>

<style lang="scss" scoped>
.logo-wrapper{
	width: 100%;
	height:60px;
	margin:0 auto;
	display:flex;
	align-items: center;
	justify-content: center;
	background-color: var(--menuBg);
	overflow:hidden;
}
.logo-wrapper img{
	width:100%;
}
.logo-wrapper span{
	color:var(--menuTextColor);
}
.logo-text{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
</style>